<template>
	<view class="content">
		<view class="position-fixed left-0 w-100" :style="{top: topFixed, 'z-index': 100}">
			<u-tabs :list="tabs" name="bname" :is-scroll="false" activeColor="var(--mainColor)" :current="current" @change="change"></u-tabs>
		</view>
		<mescroll-body ref="mescrollRef" top="80rpx" :bottombar="false" @init="mescrollInit" @down="downCallback" @up="upCallback">
			<template v-if="orderList.length">
				<block v-for="(item,index) in orderList" :key="index">
					<view class="u-m-20 u-p-20 bg-white rounded-10" @click="toDetail(item.groups_team_id)">
						<view class="flex justify-between">
							<text class="">{{item.createtime}}</text>
							<text class="text-danger" v-if="item.status == 1">拼团中</text>
							<text class="text-danger" v-if="item.status == 3">拼团成功</text>
							<text class="text-danger" v-if="item.status == 20">拼团失败</text>
						</view>
						<view class="flex align-center u-m-t-20">
							<view class="u-m-r-30">
								<u-image :src="item.order_goods[0].images" borderRadius="10" width="150rpx" height="150rpx"></u-image>
							</view>
							<view class="flex-1 flex flex-column justify-between" style="height: 100%;">
								<view class="text-ellipsis-2" style="height: 70rpx;">
									<text class="u-font-24">{{item.order_goods[0].goods_name}}</text>
								</view>
								<view class="u-p-y-15">
									<u-tag :text="`${item.total_num}人团`" size="mini" shape="circle" mode="plain" color="var(--mainColor)"></u-tag>
								</view>
								<view class="flex align-center justify-between">
									<view class="">
										<text class="u-font-30 text-danger u-m-r-20">¥ {{item.pay_price}}</text>
										<text class="u-font-20 text-greey text-through">¥ {{item.order_goods[0].line_price}}</text>
									</view>
									<view class="rounded-6 text-center" style="width: 140rpx; height: 50rpx; background-color: #fd644f;">
										<text class="text-white" style="line-height: 50rpx;">{{item.status ==1?'去邀请':'查看详情'}}</text>
									</view>
								</view>
							</view>
						</view>
					</view>
				</block>
			</template>
			<dy-no-data v-else></dy-no-data>
			<!-- 为你推荐 -->
			<view class="u-p-x-30">
				<view class="flex align-center justify-center">
					<view class="bg-dark" style="width: 200rpx;height: 2rpx;"></view>
					<text class="u-p-30 text-dark">为你推荐</text>
					<view class="bg-dark" style="width: 200rpx;height: 2rpx;"></view>
				</view>
				<view class="flex flex-wrap justify-between">
					<block v-for="(item,index) in goodsList" :key="index">
						<dy-goods-item :item="item"></dy-goods-item>
					</block>
				</view>
			</view>
		</mescroll-body>
		
	</view>
</template> 

<script>
	const status = {
		0: -1,
		1: 1,
		2: 3,
		3: 20
	}
	import MescrollMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js";
	import { GroupCenterApi, HomeCenterApi } from '@/api/serves.js'
	export default {
		mixins: [MescrollMixin], // 使用mixin
		data() {
			return {
				tabs: [
					{
						name: '全部',
					}, 
					{
						name: '拼团中',
					}, 
					{
						name: '拼团成功',
					}, 
					{
						name: '拼团失败',
					}
				],
				current: 0,
				orderList: [],
				goodsList: [],  // 推荐好物
			}
		},
		computed: {
			topFixed() {
				return  this.windowTop + 'px'
			},
		},
		methods: {
			// 下拉刷新回掉
			downCallback() {
				this._getMyTeams()
				this.mescroll.resetUpScroll() 
			},
			// 上拉加载
			upCallback(page) {	
				HomeCenterApi.getTjGoods({page: page.num}).then(res => {
				  console.log('获取精选好物', res);
					if(res.code == 1){
						if(page.num == 1) this.goodsList = []; //如果是第一页需手动制空列表
						this.goodsList = this.goodsList.concat(res.data); //追加新数据
						 this.mescroll.endByPage(res.data.length, res.totalpage)
					}else {
						this.$toast(res.msg)
						this.mescroll.endErr()
					}
				})
			},
			_getMyTeams() {
				GroupCenterApi.getMyTeams({status: status[this.current], page: 1, page_rows: 50}).then(res=> {
					console.log('拼团列表', res);
					if(res.code == 1){
						this.orderList = res.data; //追加新数据
					}else {
						this.$Toast(res.msg)
						this.mescroll.endErr()
					}
				})
			},
			change(index) {
				this.current = index
				this._getMyTeams()
			},
			toDetail(groups_team_id) {
				uni.navigateTo({
					url: '/pages/group/groupTeamDetail/groupTeamDetail?id=' + groups_team_id
				})
			}
		}
	}
</script>

<style lang="scss" scoped>

</style>
